*
{
    margin: 0;
    padding: 0;
}
body
{
    font-weight: lighter;

    color: #666;
    background: url(/static/images/admin/login/bgm.jpg) no-repeat;
    background-size: cover;
    height: 100vh;
    overflow: hidden;

    perspective: 1000px;
	transform-style: preserve-3d;
}
h1,
h2,
h3
{
    font-weight: lighter;
}
@font-face {
    font-family: 'iconfont';
    src: url(data:application/font-woff2;charset=utf-8;base64,d09GMgABAAAAAAU4AA0AAAAACfAAAAThAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP0ZGVE0cGh4GVgCCWhEICocghWwLEAABNgIkAxYEIAWFCAdNG0IIyC4KYyLTh6tEz5OVmpWHkt1yPl3+MILneTu/c9/MBBN8Qu2KSP5KqKgWRrd1juyq6gOo2ek9AIqemI1eGRQJBNVtr78JJE2aiSkILJAsCwLQXrLyPplIixOw7P9szXQBVetrp+zOugo1RZCAdt2lilBVAxpRYSuZnkB4QGE+r+0PuDMRtzBwJ0AAT0vjAHhx7wbuvhFwglCAIjQWQgcKSCInBtSh7gBrgJ+Xh8KwgWIUuPU7rK40cKi63w5oHh99ihcvIACnBjmjfYwudsF+j0U5wGSjqJrzrdu33m8HfIP92YhnEacl8yQJQAQ16UFoIh2g/HsEoCRtFKHV7m7gD2QGZAcAdAC4h8agj07dv9hYUIDFNO1OZ3BQGZd4n4H85U+uE8xrowjLpk2i/Fu2IMO7ObOG8fj5iqcPn4Jzcxt+A7ZqQPXR1lUphF/T2FXbRdkNs81ih15qg2pqWqd25xYaKv0qKreKN4rsu6AEx9OnBSHodXVlIWVJHT1/3j1sj9HdkVQtIjL9LD/42ZMuwf0ig2Ji1LNuobtUokE/Mh9SP/JWp2na2mvaK5rC3AuiqrdLNokemIaEhA229leLhg60iYcP1djPXDb5pNR55kG0vuthiev847hpvLqzv+vQVUngCe/1Ep7D15C42HolrHW5eqVtrWaVTlHdnjO6P33e9cmzXqy1C6d1YgBtpv/hpdygqRVFHV2fX9Pz4J3nuPVZlxvPQjwD3AErhsSHqMZnVNknY9YwQ5UIV9dwZSJCmUNrD0NcWr3KUWU77nnpucRZZb/UhDXlPEc85YIky4hxzZp4WM36UPhQ9rWZUCFYqITBcuKyBxYrgeWST/z/blvkqp/2+esnQ0Ime6vMvVZFcnz97JuMTuiN4RMWvvolY0tJCmiLUkcE84wuuT2+FmEYPqdk/7RZasOG1H10cjpGwmUD92Zm9gJhtKM62b7q8EuxY3M1m5+N3lWbb7M8e3MNDXNz3dpvT1elfX0c2TyV+u7L9FlY8EIwrLElVJD84SvwXgCG70P32w+DH7xw73e9fTD4wwtXyODPgv+aNxKPsCv0X2hsoQRzzuDrohidz9nO4XfDXUSKcfDVNKbdu5lI8fTdkzobQcs0sH/RnwGq3YsGyoD22gR2H2870wA10FsjXHeniFWChyQdB1P3GI1sQ3cJQbTQid45RWD1Eq3xurXENVQgGDn+OYoc70yBvKSJK/t3AQABgsUv9+6L56/+b3PoDHBr/v+bcl/zADYKgGBQ8iQxfLQiBAl64tBJsoIx3qSjCrCagZUoYIoAPkQCvSwpFELHBmHTBRSrsaCxWcLQOfvB4HAbLGw+gikrGic7BMVmNJJ2IBMAIPw5geLWFzT+Chg6pxsModbAwt9DMHXzfrBDaoyDS5NcpET5qiKNgiQl1BSELJlwj3xcMM9ddOOf7vX8lUnlgvDJAJ2Q6AqkS5QLXq5XbvLyKWo3pFx5UjIVGNJjANbl3RvqGWRltCGjy160nxfJU4jOSL58mAIsV5YMCtyKIKR06XZAQXY4SUUi4BY9cKUTm1dIN8rPxyt53e3LuuW06UXPAYAR5ZNsVvTFSrjkgB6iTidss5w4s26mYp76qsHEhlqBUKFEE10Mfcb0de6ZAzNLk8lMekaiEdu/i/hTU1hmIAAAAA==) format('woff2'),
        url(data:application/font-woff;charset=utf-8;base64,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) format('woff');
    font-weight: normal;
    font-style: normal;
}
.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon-lock:before {
  content: "\e62d";
}

.icon-user:before {
  content: "\e6a3";
}

.icon-shouji:before {
  content: "\e692";
}

.icon-yanzhengma2:before {
  content: "\e656";
}

/*pencil*/
@keyframes turn
{
    0%
    {
        top: -10em;

        transform: rotate(0deg);
    }
    100%
    {
        top: -4em;

        transform: rotate(-10deg);
    }
}
div.pencil
{
    position: absolute;
    top: -10em;
    left: 10em;

    width: 14em;
    height: 16em;

    transform-origin: bottom left;
    -webkit-animation: turn 2.5s;
         -o-animation: turn 2.5s;
            animation: turn 2.5s;

    background: url(/static/images/admin/login/pencil.png) no-repeat;
    background-size: cover;

    animation-fill-mode: forwards;
    
}
/*welcome*/
@keyframes tra
{
    0%
    {
        opacity: 0;
    }
    100%
    {
        opacity: 1;
    }
}
section.welcome
{
    font-size: 110%;

    display: block;

    width: min-content;
    margin: -1em 4em auto auto;

    -webkit-animation: tra 2.5s;
         -o-animation: tra 2.5s;
            animation: tra 2.5s;
    text-align: right;
    white-space: pre;

    opacity: 0;

    animation-fill-mode: forwards;
}
section.welcome h2
{
    margin-bottom: -1em;
    padding-bottom: .6em;

    border-bottom: thin solid #666;
}
section.welcome div.timer
{
    margin-bottom: -2em;
}
/*logo*/
div.logo
{
    position: absolute;
    z-index: -1;
    top: calc(50% - 16em);
    left: calc(50% - 12.5em);

    width: 23em;
    height: 23em;

    background: url(/static/images/admin/login/712.png) no-repeat;
    background-size: cover;
}
/*login*/
@keyframes ToOpacity{
	0%{
		opacity: 1;
	}
	100%{
		opacity: 0;
	}
}
@keyframes ToVisible{
	0%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}
@keyframes ToForward{
	0%{
		transform: rotateX(0deg);
	}
	30%{
		transform: rotateX(62deg);
	}
	70%{
		transform: rotateX(62deg);
	}
	100%{
		transform: rotateX(0deg);
	}
}
main.main
{
    margin-top: 10em;
    padding: 0 calc(50% - 400px);
}
#login-btn
{
    font-size: 130%;
	display: block;
    width: 9em;
	margin-left: calc(50% - 5.2em);
    padding: .4em 0;

    color: white;
    border: 0;
    background: rgb(81,168,221);
	cursor: pointer;
}
div.loginframe{
	
	background: white;

	position: fixed;
	top: calc(50% - 14em);
	left:-30em;
	z-index: 1;

	width: 22em;
	height: 14em;
	box-shadow: 0 0 10px gray;
	padding: 8em 0;
	transition: left 1s;
	transform-origin: bottom;

}

/**/

div.loginframe #login-close{
	font-size: 120%;

    position: absolute;
    top: 0;
    right: 0;

    width: 2.3em;
    height: 2.3em;

    cursor: pointer;
    transition: all 1s;

    color: #666;
    border: 0;
    border-radius: 50%;
    background: white;
}
div.loginframe h2{
	margin-left: 1.9em;
	margin-bottom: 1.5em;
}
div.login div.login-t{
	background:#eee;
	margin-top: 1.5em;
}
div.loginframe input:not(.submit){
	display: block;
	background:#eee;
	font-size: 120%;
	height: 2.5em;
	color: #666;
	border:0;
	width: 100%;
	z-index: 1;
	text-indent: 3em;
}
div.login div.login-t input.first_line,
div.phone-login input#Phonenum{
	border-bottom: thin solid #aaa;
}
div.loginframe label{
	position: relative;
}
div.loginframe label::before{
	position: absolute;
	content: "";

	top: 0;
	left:1em;
	right: 0;
	bottom: 0;
	font-size: 130%;
	height: 2.5em;
	line-height: 2.5em;
}
div.login div.login-t label:first-child::before{
	content:'\e6a3';
}
div.login div.login-t label[for="password"]::before{
	content:'\e62d';
}
div.loginframe div.login-p label[for="phonenum"]::before{
	content:'\e692';
}
div.loginframe div.login-p label[for="code"]::before{
	content:'\e656';
}
div.loginframe input[type="submit"]{
	font-size: 130%;
	width: 8em;
	margin-left:  2.1em ;
	margin-top: 1.5em;
	margin-bottom: 1em;
    padding: .4em 0;
	
    color: white;
    border: 0;
    background: rgb(81,168,221);
    cursor: pointer;
    
}
div.loginframe .phone-swtich{
	border:0;
	color: #666;
	cursor: pointer;
	background: none;
	font-size: 90%;
	border-bottom: thin solid #666;

	margin-left: 2.9em;
}
.phone-login{
	display: none;
	opacity:0;
}
div.login{
	background: white;
}
#smsCodeBtn {
    display: block;
    width: 6em;
    height: 3.6em;

    position: relative;
    top: -3.6em;
    left:calc(100% - 6em);
    color: white;
    border: 0;
    background: rgb(81,168,221);
    cursor: pointer;
}